﻿

var viewRoleModel = new function () {

    this.Roles = ko.observableArray(data.ListRole);
    this.CurrentPageIndex = ko.observable(1);
    this.PageSize = ko.observable(10);

    this.colName = ko.observable("Name");
    this.sortOrder = ko.observable("asc");
    this.SetOrder = SetOrder;

    //Insert max page
    this.maxPageIndex = ko.computed(function () {
        if (this.PageSize() == 0) {
            this.PageSize = ko.observable(10);
        }
        return Math.ceil(ko.utils.unwrapObservable(this.Roles()).length / this.PageSize());
    }, this);

    this.PrevButton = function () {
        this.CurrentPageIndex(this.CurrentPageIndex() - 1);
    };

    this.PrevButtonClass = ko.computed(function () {
        var page = parseInt(this.CurrentPageIndex());
        if (page > 1) {
            return "btn btn-prev-arrow prev-active";
        }
        else {
            return "btn btn-prev-arrow";
        }
    }, this);

    this.NextButtonClass = ko.computed(function () {
        if (this.CurrentPageIndex() == this.maxPageIndex() || this.maxPageIndex() == 1)
            return "btn btn-next-arrow next-disabled";
        else
            return "btn btn-next-arrow";
    }, this);

    this.NextButton = function () {
        this.CurrentPageIndex(this.CurrentPageIndex() + 1);
    };

    this.loadStatus = ko.computed(function () {

    }, this);

    this.ItemsOnPage = ko.computed(function () {
        var currentPage = this.CurrentPageIndex();
        var maxPage = this.maxPageIndex();

        if (parseInt(currentPage) == 0)
            this.CurrentPageIndex(1);

        if (parseInt(currentPage) >= parseInt(maxPage)) {
            this.CurrentPageIndex(parseInt(maxPage));
        }
        if (parseInt(this.PageSize()) <= 0) {
            this.PageSize(10);
        }
        var startIndex = this.PageSize() * (this.CurrentPageIndex() - 1);
        var endIndex = parseInt(startIndex) + parseInt(this.PageSize());

        return this.Roles().slice(startIndex, endIndex);
    }, this);


    // Sort 
    function SetTHClass(event, colName) {
        //remove the existing classes
        $("div.title").parent().find(".sort_wrapper").children("span").removeClass("asc");
        $("div.title").parent().find(".sort_wrapper").children("span").removeClass("desc");

        if (viewRoleModel.sortOrder() === "asc") {
            $("#" + colName + " span").addClass("asc");

        } else {
            $("#" + colName + " span").addClass("desc");
        }
    }


    function switchSortOrder() {
        if (viewRoleModel.sortOrder() === "asc") {
            viewRoleModel.sortOrder("desc");
        } else {
            viewRoleModel.sortOrder("asc");
        }
    }
    function SetOrder(event, colName) {
        switchSortOrder();
        SetTHClass(event, colName);
        if (colName != "")
            viewRoleModel.Roles(SortByPropertyName(ko.utils.unwrapObservable(viewRoleModel.Roles()), colName, viewRoleModel.sortOrder()));
    }

    // sort all items
    function SortByPropertyName(items, propertyName, sortOrder) {
        return items.sort(sortProperty(propertyName, sortOrder));
    }
    function sortProperty(property, sortOrder) {
        if (sortOrder == "asc")
            return function (a, b) {
                var number = parseFloat(a[property].toLowerCase());
                if (number != NaN && number > 0)
                    return (parseFloat(a[property].toLowerCase()) < parseFloat(b[property].toLowerCase())) ? -1 : (parseFloat(a[property].toLowerCase()) > parseFloat(b[property].toLowerCase())) ? 1 : 0;
                else
                    return (a[property].toLowerCase() < b[property].toLowerCase()) ? -1 : (a[property].toLowerCase() > b[property].toLowerCase()) ? 1 : 0;
            }
        else
            return function (a, b) {
                var number = parseFloat(a[property].toLowerCase());
                if (number > 0)
                    return (parseFloat(a[property].toLowerCase()) > parseFloat(b[property].toLowerCase())) ? -1 : (parseFloat(a[property].toLowerCase()) < parseFloat(b[property].toLowerCase())) ? 1 : 0;
                else
                    return (a[property].toLowerCase() > b[property].toLowerCase()) ? -1 : (a[property].toLowerCase() < b[property].toLowerCase()) ? 1 : 0;
            }

    }


}

ko.applyBindings(viewRoleModel, document.getElementById("main"));